import React, { useState, useEffect } from 'react';
import { Button, Divider,Popconfirm} from 'antd';
import { useHistory } from 'react-router-dom';
import { LogoutOutlined, HomeOutlined, LoadingOutlined, RollbackOutlined } from '@ant-design/icons';
import {
  openNotification_util, checkdatavalid_util_formdata, fetchsync_util,
  resultdata_to_formdata, addkey_for_mxdata,
  use_dict_byzdmc,
  use_olreport_bybbbm,
  combile_mxdata_mxcol_util,
  convertISODateTimeToYYYYMMDD,
  convertISODateTimeToYYYYMMDDHHMM,
  view_item_util,
  getCurrentDate_util,
} from '../util/util.js'
import Customfielditem_hook from '../newmes/customfielditem_hook.js'
import moment from 'moment'
import 'moment/locale/zh-cn'
import Gys_ghmx_hook from './gys_ghmx_hook.js';
import Gys_zzmx_hook from './gys_zzmx_hook.js';
import Gys_sqmx_hook from './gys_sqmx_hook.js';
import Gys_yhmx_hook from './gys_yhmx_hook.js';
import Gys_kpmx_hook from './gys_kpmx_hook.js';
import { SaveOutlined } from '@ant-design/icons';
import logo from '../../../img/shipSRM/chlogo.png'
import {
  use_gysbg_initformdata, use_gysbg_initformdata_view,
  use_gys_ghmx_column_initformdata,
  use_gys_zzsz_column_initformdata,
  use_gys_yhmx_column_initformdata,
  use_gys_sqmx_column_initformdata
} from '../gyszx/use_gyszx_config.js';
moment.locale('zh-cn')
var storage = window.localStorage;
import useStore from '../../useStore.js'
import { dropByCacheKey } from 'react-router-cache-route'


const Gys_form = () => {
  const history = useHistory();
  //动态数据源
  const [dynDatasObject, setdynDatasObject] = useState({
    kfkhdaOptions: [], dict_qylx: [], dict_gyslx: [], dict_gj: [], dict_sf: [], dict_cs: [], dict_hzzt: [], dict_ghlx: [], dict_bslx: [], dict_zsmc: [], dict_zzmc: [],
    gys_cp: [], gys_mj: [], gd_mjmx: [], data_ejfl: []
  })
  const [isloading, setisloading] = useState(true)
  const [ghmxcolums, setghmxcolums] = useState(use_gys_ghmx_column_initformdata)
  const [ghmxdata, setghmxdata] = useState([])
  const [yghmxdata, setyghmxdata] = useState([])
  const [zzmxcolums, setzzmxcolums] = useState(use_gys_zzsz_column_initformdata)
  const [zzmxdata, setzzmxdata] = useState([])
  const [yzzmxdata, setyzzmxdata] = useState([])
  const [ghdelidarr, setghdelidarr] = useState([])
  const [zzdelidarr, setzzdelidarr] = useState([])
  const [sqmxcolums, setsqmxcolums] = useState(use_gys_sqmx_column_initformdata)
  const [sqdelidarr, setsqdelidarr] = useState([])
  const [sqmxdata, setsqmxdata] = useState([])
  const [ysqmxdata, setysqmxdata] = useState([])
  const [yhmxcolums, setyhmxcolums] = useState(use_gys_yhmx_column_initformdata)
  const [yhmxdata, setyhmxdata] = useState([])
  const [yyhmxdata, setyyhmxdata] = useState([])
  const [yhdelidarr, setyhdelidarr] = useState([])



  /**
   * 强制刷新明细表 用于特殊场景
   */
  const [switche, setswitche] = useState(true);
  const forceupdate = () => { setswitche(false) }
  useEffect(() => { switche ? "1" : setswitche(true) }, [switche])

  const init = async () => {
    setisloading(true)
    var dictObj = await use_dict_byzdmc(["dict_qylx", "dict_gyslx", "dict_hzzt", "dict_ghlx", "dict_bslx", "dict_zsmc", "dict_zzmc"])

    var bbObj = await use_olreport_bybbbm(["data_ejfl"])

    console.log("当前插叙得到的query_ejfl为", bbObj.data_ejfl)

    dynDatasObject.dict_qylx = dictObj.dict_qylx
    dynDatasObject.dict_gyslx = dictObj.dict_gyslx
    dynDatasObject.dict_hzzt = dictObj.dict_hzzt
    dynDatasObject.dict_ghlx = dictObj.dict_ghlx
    dynDatasObject.dict_bslx = dictObj.dict_bslx
    dynDatasObject.dict_zsmc = dictObj.dict_zsmc
    dynDatasObject.dict_zzmc = dictObj.dict_zzmc

    dynDatasObject.data_ejfl = bbObj.data_ejfl
    // dynDatasObject.dict_gj = getCommonCountries()
    // dynDatasObject.dict_sf = getProvinces()

    setdynDatasObject({ ...dynDatasObject })
    setisloading(false)
  }

  //主表数据
  const [formdata, setformdata] = useState(use_gysbg_initformdata)
  const [viewformdata, setviewformdata] = useState(use_gysbg_initformdata_view)
  const [yformdata, setyformdata] = useState(use_gysbg_initformdata)
  const { nowroute, setnowroute, collapsed, setcollapsed } = useStore();





  //加载主表数据
  const loadformdata = async (gysdm) => {

    let rtdata = await fetchsync_util("/admin/gyszx/query_gys_bydm", 'POST', { gysdm }, "json")
    console.log(rtdata.resultdata.formdata)
    setformdata({ ...formdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, formdata) });
    setyformdata({ ...yformdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, yformdata) })
    //
    setghmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.ghmxdata))))

    setyghmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.ghmxdata))))

    setzzmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.zzmxdata))))
    setyzzmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.zzmxdata))))
    setsqmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.sqmxdata))))
    setysqmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.sqmxdata))))
    setyhmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.yhmxdata))))
    setyyhmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.yhmxdata))))

  }

  //加载主表数据
  const loadformdatabyid = async (data) => {

    // console.log("当前加载的供应商代码为=======：")
    console.log("当前加载的供应商代码为=======：", data)
    let rtdata = await fetchsync_util("/admin/gyszx/query_gysbg_byid", 'POST', { data }, "json")
    console.log(rtdata.resultdata.formdata)

    rtdata.resultdata.formdata.zzyxqks = rtdata.resultdata.formdata.zzyxqks ? convertISODateTimeToYYYYMMDD(rtdata.resultdata.formdata.zzyxqks) : ""
    rtdata.resultdata.formdata.sfzyxqks = rtdata.resultdata.formdata.sfzyxqks ? convertISODateTimeToYYYYMMDD(rtdata.resultdata.formdata.sfzyxqks) : ""
    rtdata.resultdata.formdata.sfzyxqjs = rtdata.resultdata.formdata.sfzyxqjs ? convertISODateTimeToYYYYMMDD(rtdata.resultdata.formdata.sfzyxqjs) : ""
    rtdata.resultdata.formdata.bgsj = rtdata.resultdata.formdata.bgsj ? convertISODateTimeToYYYYMMDDHHMM(rtdata.resultdata.formdata.bgsj) : ""

    setformdata({ ...formdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, viewformdata) });
    setyformdata({ ...yformdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, yformdata) })
    //
    setghmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.ghmxdata))))

    setyghmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.ghmxdata))))

    setzzmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.zzmxdata))))
    setyzzmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.zzmxdata))))
    setsqmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.sqmxdata))))
    setysqmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.sqmxdata))))
    setyhmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.yhmxdata))))
    setyyhmxdata(addkey_for_mxdata(JSON.parse(JSON.stringify(rtdata.resultdata.yhmxdata))))

  }

  //监听省份变化获取对应城市列表
  // useEffect(() => {
  //   if (formdata.sf.value) {
  //     const cities = getCitiesByProvince(formdata.sf.value);
  //     dynDatasObject.dict_cs = cities;
  //     setdynDatasObject({ ...dynDatasObject });
  //   }
  // }, [formdata.sf.value]);



  //获取常见国家列表
  

  //获取中国省份列表
 
  //根据省份获取对应城市列表
 


  //将日期和时间字符串转换为日期格式
  const convertToDate = (dateStr, timeStr) => {
    return `TO_DATE('${dateStr} ${timeStr}', 'YYYY-MM-DD HH24:MI:SS')`;
  }


  // 页面进入加载数据
  useEffect(() => {
    if (JSON.parse(storage.pre_gysbg_item).type == "edit") {
      loadformdatabyid(JSON.parse(storage.pre_gysbg_item).data.id)
      init()
    }
    else if (JSON.parse(storage.pre_gysbg_item).type == "add") {
      console.log(1111111111);
      loadformdata(storage.ygbh)
      init()
      // setkpmxcolums(view_item_util(use_gys_kpmx_column_initformdata()))
    }
    else {
      loadformdatabyid(JSON.parse(storage.pre_gysbg_item).data.id)
      setghmxcolums(view_item_util(use_gys_ghmx_column_initformdata()))
      setsqmxcolums(view_item_util(use_gys_sqmx_column_initformdata()))
      setyhmxcolums(view_item_util(use_gys_yhmx_column_initformdata()))
      setzzmxcolums(view_item_util(use_gys_zzsz_column_initformdata()))
      // setkpmxcolums(view_item_util(use_gys_kpmx_column_initformdata()))
      setisloading(false)
    }
  }, [])


  //设置value
  const setfield = (onekey, value, settype) => {
    if (settype == 'single') {
      var newitem = formdata[onekey]
      newitem.value = value
      let newformdata = Object.assign({}, formdata, { [onekey]: newitem });
      setformdata(newformdata)
    }
    else if (settype == "muti") {
      let [tansferarr, selectrow, newformdata] = [onekey, value, {}];
      tansferarr.forEach(item => {
        var newitem = formdata[item.target]
        newitem.value = selectrow ? selectrow[item.origin] : ""
        newformdata = Object.assign({}, formdata, { [item.target]: newitem });
      })
      setformdata(newformdata)
    }

  }


  const handleupload = async () => {


    var checkobj = checkdatavalid_util_formdata(formdata)
    //主表字段校验没通过不能保存，目前没写子表校验。

    if (!checkobj.rtstatus) { openNotification_util(checkobj.rtmessage); return; }
    else;
    //拼接明细
    var newghmxdatalist = combile_mxdata_mxcol_util(ghmxdata, ghmxcolums)
    var newsqmxdatalist = combile_mxdata_mxcol_util(sqmxdata, sqmxcolums)
    var newyhmxdatalist = combile_mxdata_mxcol_util(yhmxdata, yhmxcolums)
    var newzzmxdatalist = combile_mxdata_mxcol_util(zzmxdata, zzmxcolums)


    // 对比formdata和yformdata的值变化
    let changes = [];
    for (let key in formdata) {
      if (formdata[key].value !== yformdata[key].value) {
        if (key == "bgsj") {
          let bgsj = getCurrentDate_util(2)
          changes.push(`${formdata[key].title}为${bgsj}`);
        }
        else {
          changes.push(`${formdata[key].title}:${yformdata[key].value}->${formdata[key].value}`);
        }
      }
    }

    // 用分号拼接变化记录
    const changeLog = changes.join(' | ');
    formdata.bgxj.value = changeLog;
    console.log("当前变更记录为：", changeLog)
    // Compare ghmxdata with yghmxdata to track changes
    let ghmxChanges = [];
    let sqmxChanges = [];
    let yhmxChanges = [];
    let zzmxChanges = [];



    // Helper function to track changes between old and new data
    const trackChanges = (type, newData, oldData) => {
      let changes = [];

      newData.forEach(newRow => {
        const oldRow = oldData.find(oldRow => oldRow.id === newRow.id);
        if (oldRow) {
          // Compare fields for existing rows
          let rowChanges = [];
          for (let key in newRow) {
            if (newRow[key] !== oldRow[key]) {
              if (key !== 'id' && key !== 'xuhao' && key !== 'key') {
                rowChanges.push(`【${oldRow[key]}->${newRow[key]}】`);
              }
            }
          }

          if (rowChanges.length > 0) {
            changes.push(`变更:第${newRow.xuhao}行;${rowChanges.join(';')}`);
          }
        } else {
          // Track new rows
          let newRowData = [];
          for (let key in newRow) {
            if (newRow[key]) {
              if (key === 'xuhao') {
                newRowData.push(`第${newRow[key]}行`);
              }
            }
          }
          changes.push(`新增${newRowData.join(';')}`);
        }
      });

      return changes;
    }

    // Track changes for each data type
    ghmxChanges.push(...trackChanges("供货能力", ghmxdata, yghmxdata));
    sqmxChanges.push(...trackChanges("代理授权", sqmxdata, ysqmxdata));
    yhmxChanges.push(...trackChanges("开票信息", yhmxdata, yyhmxdata));
    zzmxChanges.push(...trackChanges("资质证书", zzmxdata, yzzmxdata));
    if (ghmxChanges.length > 0) {
      console.log(ghmxChanges,"ghmxChanges");
      const ghmxChangeLog = ghmxChanges.join(' , ');
      formdata.bgxj.value = changeLog + ` | ` + '配套能力：' + ghmxChangeLog;
    }
    if (sqmxChanges.length > 0) {
      const sqmxChangeLog = sqmxChanges.join(' , ');
      formdata.bgxj.value = formdata.bgxj.value + ` | ` + '代理授权：' + sqmxChangeLog;
    }
    if (yhmxChanges.length > 0) {
      const yhmxChangeLog = yhmxChanges.join(' , ');
      formdata.bgxj.value = formdata.bgxj.value + ` | ` + '开票信息：' + yhmxChangeLog;
    }
    if (zzmxChanges.length > 0) {
      const zzmxChangeLog = zzmxChanges.join(' , ');
      formdata.bgxj.value = formdata.bgxj.value + ` | ` + '资质证书：' + zzmxChangeLog;
    }


    console.log("当前最终变更记录为：", formdata.bgxj.value)
    //设置submit url
    var uploadurl = "/admin/gyszx/add_gysbg";
    let rtdata = await fetchsync_util(uploadurl, 'POST', {
      formdata,
      ghmxdata: newghmxdatalist,
      sqmxdata: newsqmxdatalist,
      yhmxdata: newyhmxdatalist,
      zzmxdata: newzzmxdatalist,

      ghdelidarr: ghdelidarr,
      sqdelidarr: sqdelidarr,
      yhdelidarr: yhdelidarr,
      zzdelidarr: zzdelidarr,

    }, "json")
    rtdata.rtstatus ? openNotification_util(rtdata.rtmessage) : 1
    setformdata(rtdata.resultdata.formdata);

    dropByCacheKey('gysbg_list')
    dropByCacheKey('gysbg_form')
    setnowroute({ route: "/shipSRM/gyszx/gysbg_list", title: "供应商变更", closeroute: "/shipSRM/gyszx/gysbg_form" })

  }

  //通过
  const handlePass = async () => {
    //拼接明细
    var newghmxdatalist = combile_mxdata_mxcol_util(ghmxdata, ghmxcolums)
    var newsqmxdatalist = combile_mxdata_mxcol_util(sqmxdata, sqmxcolums)
    var newyhmxdatalist = combile_mxdata_mxcol_util(yhmxdata, yhmxcolums)
    var newzzmxdatalist = combile_mxdata_mxcol_util(zzmxdata, zzmxcolums)
    await fetchsync_util("/admin/gyszx/apply_gysbg", 'POST', { formdata, ghmxdata:newghmxdatalist, sqmxdata:newsqmxdatalist, yhmxdata:newyhmxdatalist,
       zzmxdata:newzzmxdatalist }, "json")
    openNotification_util("通过成功")
  }

  //驳回
  const handleRefuse = async () => {
    await fetchsync_util("/admin/gyszx/refuse_gysbg", 'POST', { formdata }, "json")
    openNotification_util("驳回成功")
  }

  const renderfileditem = () => {
    var formdataarr = []
    for (var formitemkey in formdata) {
      formdata[formitemkey].inputType == "none" ? "" : formdataarr.push(formdata[formitemkey])
    }
    var renderstr = formdataarr.map(item => {
      var rtitem = item.input_type == "space_item" ?
        <Customfielditem_hook form={formdata} item={{ inputType: "none" }}
          handlechange={(key, value, settype) => { setfield(key, value, settype) }} />
        :
        <Customfielditem_hook form={formdata} item={formdata[item.dataIndex]}
          dynDatasObject={dynDatasObject}
          handlechange={(key, value, settype) => { setfield(key, value, settype) }} />
      return rtitem
    }
    )
    return renderstr
  }

  return (

    <div style={{
      height: "94%", backgroundColor: `#F1F1F1`, right: "1%", top: "5.9vh", overflow: "hidden",
      backgroundSize: "100% 100%", width: collapsed ? "94%" : "84%", position: "absolute", color: "white", fontSize: "0.8rem"
    }}
    data-page-type="form">



      <div style={{width:"100%",height:"100%",backgroundColor:"white",overflow:"auto"}}>
      <div style={{
        width: "100%", height: "7%", position: "sticky", top: "1%", backgroundColor: "white", color: "black", display: "flex",
        zIndex: 105, borderBottom: "2px solid #a91f24"
      }}>


        <div style={{ width: "40%", textAlign: "left", paddingRight: "1rem", display: "flex", alignItems: "center", fontWeight: "600" }}>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          工具栏
        </div>
        <div style={{ width: "60%", textAlign: "right", paddingRight: "1rem" }}>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          {storage.yhlx === "租户用户" && JSON.parse(storage.pre_gysbg_item).type != "view" &&
            <Popconfirm title="确定要提交吗？" onConfirm={handleupload} okText="确定" cancelText="取消">
              <Button type="primary"
                style={{ width: "6rem", height: '1.7rem', fontSize: "0.7rem", borderRadius: "5px", marginTop: "0.2rem" }}>
                提交</Button>
            </Popconfirm>
          }
          {storage.yhlx === "管理用户" && formdata.clzt.value == "未审批" &&
            <Popconfirm title="确定要通过并更新吗？" onConfirm={handlePass} okText="确定" cancelText="取消">
              <Button type="primary"
                style={{ width: "6rem", height: '1.7rem', fontSize: "0.7rem", borderRadius: "5px", marginTop: "0.2rem" }}>
                通过并更新</Button>
            </Popconfirm>
          }
          &nbsp;&nbsp;&nbsp;&nbsp;
          {storage.yhlx === "管理用户" && formdata.clzt.value == "未审批" &&
            <Popconfirm title="确定要驳回吗？" onConfirm={handleRefuse} okText="确定" cancelText="取消">
              <Button type="default"
                style={{ width: "6rem", height: '1.7rem', fontSize: "0.7rem", borderRadius: "5px", marginTop: "0.2rem" }}>
                驳回变更</Button>
            </Popconfirm>
          }

        </div>
      </div>


      <div style={styles.kshcontainer}>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "98%", marginLeft: "1%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {renderfileditem()}
        </div>
        {/* 主表区域结束 */}
        <Divider></Divider>
        <div
          style={{

            height: "1.2rem",
            marginLeft: "2%",
            position: "relative",
            width: "96%",
            textIndent: "0.5rem",
            color: "#666666",
            backgroundColor: "white",
            lineHeight: "1.2rem",
            fontSize: "14px",
            fontWeight: "500",
            textAlign: "left",
            borderLeftStyle: "solid",
            borderWidth: "0.3rem",
            borderColor: "#a91f24",
            marginTop: "1rem",
            marginBottom: "0.5rem",
            letterSpacing: "0.05rem"
          }}
        >
          配套能力
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "98%", marginLeft: "1%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Gys_ghmx_hook colmuns={ghmxcolums} datasource={ghmxdata}
                show_delete={false}
                onepageheight="10vh"
                styleobj={{ height: "70%" }}
                ifshowaddbtn={JSON.parse(storage.pre_gysbg_item).type != "view" ? true : false}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { ids.length !== 0 ? setghdelidarr([...ghdelidarr, ...ids]) : ''; }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setghmxdata(tabledata)
                }}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }

        </div>
        <Divider></Divider>
        <div
          style={{

            height: "1.2rem",
            marginLeft: "2%",
            position: "relative",
            width: "96%",
            textIndent: "0.5rem",
            color: "#666666",
            backgroundColor: "white",
            lineHeight: "1.2rem",
            fontSize: "14px",
            fontWeight: "500",
            textAlign: "left",
            borderLeftStyle: "solid",
            borderWidth: "0.3rem",
            borderColor: "#a91f24",
            marginTop: "1rem",
            marginBottom: "0.5rem",
            letterSpacing: "0.05rem"
          }}
        >
          资质证书
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "98%", marginLeft: "1%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Gys_zzmx_hook colmuns={zzmxcolums} datasource={zzmxdata}
                ifshowaddbtn={JSON.parse(storage.pre_gysbg_item).type != "view" ? true : false}
                onepageheight="10vh"
                styleobj={{ height: "70%" }}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { ids.length !== 0 ? setzzdelidarr([...zzdelidarr, ...ids]) : ''; }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setzzmxdata(tabledata)
                }}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }


        </div>
        <Divider></Divider>
        <div
          style={{

            height: "1.2rem",
            marginLeft: "2%",
            position: "relative",
            width: "96%",
            textIndent: "0.5rem",
            color: "#666666",
            backgroundColor: "white",
            lineHeight: "1.2rem",
            fontSize: "14px",
            fontWeight: "500",
            textAlign: "left",
            borderLeftStyle: "solid",
            borderWidth: "0.3rem",
            borderColor: "#a91f24",
            marginTop: "1rem",
            marginBottom: "0.5rem",
            letterSpacing: "0.05rem"
          }}
        >
          授权代理人
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "98%", marginLeft: "1%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Gys_sqmx_hook colmuns={sqmxcolums} datasource={sqmxdata}

                onepageheight="10vh"
                styleobj={{ height: "70%" }}
                dynDatasObject={dynDatasObject}
                ifshowaddbtn={JSON.parse(storage.pre_gysbg_item).type != "view" ? true : false}
                formdata={formdata}
                handledelid={ids => { ids.length !== 0 ? setsqdelidarr([...sqdelidarr, ...ids]) : ''; }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setsqmxdata(tabledata)
                }}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }

        </div>
        {/* 主表区域结束 */}
        <Divider></Divider>
        <div
          style={{

            height: "1.2rem",
            marginLeft: "2%",
            position: "relative",
            width: "96%",
            textIndent: "0.5rem",
            color: "#666666",
            backgroundColor: "white",
            lineHeight: "1.2rem",
            fontSize: "14px",
            fontWeight: "500",
            textAlign: "left",
            borderLeftStyle: "solid",
            borderWidth: "0.3rem",
            borderColor: "#a91f24",
            marginTop: "1rem",
            marginBottom: "0.5rem",
            letterSpacing: "0.05rem"
          }}
        >
          银行账户
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "98%", marginLeft: "1%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Gys_yhmx_hook colmuns={yhmxcolums} datasource={yhmxdata}
                ifshowaddbtn={JSON.parse(storage.pre_gysbg_item).type != "view" ? true : false}
                onepageheight="10vh"
                styleobj={{ height: "70%" }}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { ids.length !== 0 ? setyhdelidarr([...yhdelidarr, ...ids]) : ''; }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setyhmxdata(tabledata)
                }}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }


        </div>
        {/* <Divider></Divider>
        <div
          style={{
            
            height: "1.2rem",
            marginLeft:"2%",
            position: "relative",
            width: "96%",
            textIndent: "0.5rem",
            color: "#666666",
            backgroundColor: "white",
            lineHeight: "1.2rem",
            fontSize: "14px",
            fontWeight: "500",
            textAlign: "left",
            borderLeftStyle: "solid",
            borderWidth: "0.3rem",
            borderColor: "#a91f24",
            marginTop:"1rem",
            marginBottom:"0.5rem",
            letterSpacing:"0.05rem"
          }}
        >
          考评历史
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
          (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
          :
          <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom:"1rem" }}>
            {switche && <Gys_kpmx_hook colmuns={kpmxcolums} datasource={kpmxdata}
            
              onepageheight="10vh"
              styleobj={{  height: "70%" }}
              dynDatasObject={dynDatasObject}
              formdata={formdata}
              handledelid={ids => { ids.length !== 0 ? setkpdelidarr([...kpdelidarr, ...ids]) : ''; }}
              handgetmxdata={(tabledata) => {
                addkey_for_mxdata(tabledata)
                setkpmxdata(tabledata)
              }}
              handlechangeFormdata={(data) => {
                setformdata(data)
              }}
              forceupdate={forceupdate}
            />}</div>
        }
        </div> */}

      </div>
      </div>
    </div>
  )
}


export default Gys_form
var styles = {
  maincontainer: {
    height: "100vh", backgroundColor: `white`,
    backgroundSize: "100% 100%", width: "100%", position: "absolute", left: "0", color: "white", fontSize: "0.8rem"
  },
  topcontainer: {
    width: "100%", height: "10vw", backgroundImage: "linear-gradient(to bottom,#e4e5eb , white)", paddingTop: "3vw",
    position: "relative", fontSize: "0.89rem", textIndent: "2rem", fontWeight: "800", color: "#a91f24", borderRadius: "0 0 15px 15px"
  },
  butdcstyle: { paddingLeft: "1vw", paddingRight: "1vw", height: "2vw", position: "absolute", right: "1%", top: "0%", backgroundColor: "#a91f24", fontSize: "0.8vw", borderRadius: "0.4rem", borderRadius: "0 0 0.3vw 0.3vw" },
  butmainstyle: { paddingLeft: "1vw", height: "2vw", position: "absolute", right: "6.5%", top: "0%", backgroundColor: "#a91f24", fontSize: "0.8vw", borderRadius: "0.4rem", borderRadius: "0 0 0.3vw 0.3vw" },
  butbackstyle: { borderRadius: "0.4rem", backgroundColor: "#a91f24", height: "2vw", position: "absolute", right: "12%", top: "0%", fontSize: "0.8vw", borderRadius: "0 0 0.3vw 0.3vw" },
  kshcontainer: {
    width: "98%", position: "relative", backgroundColor: "white", color: "#666",
    borderRadius: "10px", paddingBottom: "2rem", overflow: "visible"
  },
}